﻿
<!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1">
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" />
    <meta name="apple-mobile-web-app-capable" content="yes" />
    <meta name="apple-mobile-web-app-status-bar-style" content="black" />
    <meta name="format-detection" content="telephone=yes" />
    <meta name="format-detection" content="email=no" />
    <title>勘查信息手机版</title>
    <link rel="stylesheet" type="text/css" href="css/css.css" />
    <meta content="勘查信息手机版" name="keywords" />
</head>
<body>
    <div class="tzrl_box">
        <div class="mq_top">
            <div class="btn_back_l">
                <a class="btn_back" onclick="history.go(-1)">
                    <span></span>
                    <nav>返回</nav>
                </a>
            </div>
            <div class="mq_title">
                现场照片要求
            </div>
            <div class="btn_ch_r">
            </div>
        </div>
        <div class="job_content">
            <div class="d_description">
                <h3 class="d_title">
                    基本信息
                </h3>
                <div class="d_pos_box">
                    <dl>
                        <dt>小区外部环境</dt>
                        <dd>
                            <input type="file" name="Images" id="1" onchange="add(this,1)" style="display:none" />
                            <div id="preview1" style="width: 150px;height: 125px;" onclick="document.getElementById(1).click();">
                                <img src="images/1.jpg" /></div>
                            <div id="result"></div>
                        </dd>
                    </dl>
                    <dl>
                        <dt>小区门前道路</dt>
                        <dd>
                            <input type="file" name="Images" id="2" onchange="add(this,2)" style="display: none" />
                            <div id="preview2"  style="width: 150px;height: 125px;" onclick="document.getElementById(2).click();" ><img src="images/1.jpg" /></div>
                        </dd>
                    </dl>
                    <dl>
                        <dt>小区入口</dt>
                        <dd>
                            <input type="file" name="Images" id="3" onchange="add(this,3)" style="display: none" />
                            <div id="preview3"  style="width: 150px;height: 125px;" onclick="document.getElementById(3).click();" ><img src="images/1.jpg" /></div>
                        </dd>
                    </dl>
                    <dl>
                        <dt>小区绿化</dt>
                        <dd>
                            <input type="file" name="Images" id="4" onchange="add(this,4)" style="display: none" />
                            <div id="preview4"  style="width: 150px;height: 125px;" onclick="document.getElementById(4).click();" ><img src="images/1.jpg" /></div>
                        </dd>
                    </dl>
                    <dl>
                        <dt>小区内部环境</dt>
                        <dd>
                            <input type="file" name="Images" id="5" onchange="add(this,5)" style="display: none" />
                            <div id="preview5"  style="width: 150px;height: 125px;" onclick="document.getElementById(5).click();" ><img src="images/1.jpg" /></div>
                        </dd>
                    </dl>
                    <dl>
                        <dt>-物业地址（建筑楼牌）</dt>
                        <dd>
                            <input type="file" name="Images" id="6" onchange="add(this,6)" style="display: none" />
                            <div id="preview6"  style="width: 150px;height: 125px;" onclick="document.getElementById(6).click();" ><img src="images/1.jpg" /></div>
                        </dd>
                    </dl>
                    <dl>
                        <dt>建筑外观</dt>
                        <dd>
                            <input type="file" name="Images" id="7" onchange="add(this,7)" style="display: none" />
                            <div id="preview7"  style="width: 150px;height: 125px;" onclick="document.getElementById(7).click();" ><img src="images/1.jpg" /></div>
                        </dd>
                    </dl>
                    <dl>
                        <dt>单元门</dt>
                        <dd>
                            <input type="file" name="Images" id="8" onchange="add(this,8)" style="display: none" />
                            <div id="preview8"  style="width: 150px;height: 125px;" onclick="document.getElementById(8).click();" ><img src="images/1.jpg" /></div>
                        </dd>
                    </dl>
                    <dl>
                        <dt>楼梯间</dt>
                        <dd>
                            <input type="file" name="Images" id="9" onchange="add(this,9)" style="display: none" />
                            <div id="preview9"  style="width: 150px;height: 125px;" onclick="document.getElementById(9).click();" ><img src="images/1.jpg" /></div>
                        </dd>
                    </dl>
                    <dl>
                        <dt>入户门</dt>
                        <dd>
                            <input type="file" name="Images" id="10" onchange="add(this,10)" style="display: none" />
                            <div id="preview10"  style="width: 150px;height: 125px;" onclick="document.getElementById(10).click();" ><img src="images/1.jpg" /></div>
                        </dd>
                    </dl>
                    <dl>
                        <dt>卧室</dt>
                        <dd>
                            <input type="file" name="Images" id="12" onchange="add(this,12)" style="display: none" />
                            <div id="preview12"  style="width: 150px;height: 125px;" onclick="document.getElementById(12).click();" ><img src="images/1.jpg" /></div>
                        </dd>
                    </dl>
                    <dl>
                        <dt>居室（不少于三张）</dt>
                        <dd>
                            <input type="file" name="Images" id="11" onchange="add(this,11)" style="display: none" />
                            <div id="preview11"  style="width: 150px;height: 125px;" onclick="document.getElementById(11).click();" ><img src="images/1.jpg" /></div>
                        </dd>
                    </dl>
                    <dl>
                        <dt>客厅</dt>
                        <dd>
                            <input type="file" name="Images" id="13" onchange="add(this,13)" style="display: none" />
                            <div id="preview13"  style="width: 150px;height: 125px;" onclick="document.getElementById(13).click();" ><img src="images/1.jpg" /></div>
                        </dd>
                    </dl>
                    <dl>
                        <dt>厨房</dt>
                        <dd>
                            <input type="file" name="Images" id="14" onchange="add(this,14)" style="display: none" />
                            <div id="preview14"  style="width: 150px;height: 125px;" onclick="document.getElementById(14).click();" ><img src="images/1.jpg" /></div>
                        </dd>
                    </dl>
                    <dl>
                        <dt>卫生间</dt>
                        <dd>
                            <input type="file" name="Images" id="15" onchange="add(this,15)" style="display: none" />
                            <div id="preview15"  style="width: 150px;height: 125px;" onclick="document.getElementById(15).click();" ><img src="images/1.jpg" /></div>
                        </dd>
                    </dl>
                    <dl>
                        <dt>阳台</dt>
                        <dd>
                            <input type="file" name="Images" id="16" onchange="add(this,16)" style="display: none" />
                            <div id="preview16"  style="width: 150px;height: 125px;" onclick="document.getElementById(16).click();" ><img src="images/1.jpg" /></div>
                        </dd>
                    </dl>
                    <dl>
                        <dt>窗外景观</dt>
                        <dd>
                            <input type="file" name="Images" id="17" onchange="add(this,17)" style="display: none" />
                            <div id="preview17"  style="width: 150px;height: 125px;" onclick="document.getElementById(17).click();" ><img src="images/1.jpg" /></div>
                        </dd>
                    </dl>
                    <dl>
                        <dt>估价人员在现场</dt>
                        <dd>
                            <input type="file" name="Images" id="18" onchange="add(this,18)" style="display: none" />
                            <div id="preview18"  style="width: 150px;height: 125px;" onclick="document.getElementById(18).click();" ><img src="images/1.jpg" /></div>
                        </dd>
                    </dl>
                    <dl>
                        <dt>电梯间</dt>
                        <dd>
                            <input type="file" name="Images" id="19" onchange="add(this,19)" style="display: none" />
                            <div id="preview19"  style="width: 150px;height: 125px;" onclick="document.getElementById(19).click();" ><img src="images/1.jpg" /></div>
                        </dd>
                    </dl>
                </div>
            </div>
        </div>
        <div class="footer">
            <div class="footer_top">
                <ul class="user_info">
                    <a href="Index.html">主页</a>
                </ul>
                <ul class="back_top">
                    <a href="javascript:scroll(0,0)">TOP</a>
                </ul>
            </div>
            <ul class="copyright">
                <li>
                    <a href="javascript:;">电脑版</a><span>|</span><a href="javascript:;">普通版</a><span>|</span><a href="javascript:;">用户反馈</a><span>|</span><a href="javascript:;">联系我们</a>
                </li>
                <li>&copy;Copyright 北京中资房产 by 房产估价系统1.0 </li>
            </ul>
        </div>
    </div>
    <script type="text/javascript" src="js/jquery.js"></script>
    <script type="text/javascript" src="js/layer/layer.js"></script>
    <script type="text/javascript" src="writeJS/WebApi.js"></script>
    <script type="text/javascript">
        var uri = document.location.search;//接收页面传值
        var i = uri.lastIndexOf("?") + 1;//获取问号前面的值
        var P_ReportNumber11 = uri.substr(i);//截取问号前面的值
        window.onload = function () {

            var result = document.getElementById("result");

        }
        $(function () {

        })
        //上传控件的触发方法
        function add(file, a) {
            var prevDiv = document.getElementById('preview' + a);

            if (file.files && file.files[0]) {
                var filetype = file.files[0];
                if (!/image\/\w+/.test(filetype.type)) {
                    alert("文件必须为图片！");
                    return false;
                }
                else {
                    var reader = new FileReader();
                    reader.onload = function (evt) {
                        prevDiv.innerHTML = '<img id="image"  src="' + this.result + '" />';
                        result.value = this.result;//把文件的结果值

                        $.ajax({
                            type: "post",
                            url:ApiUrl+ "api/SitePicture/AddSitePicture",
                            // async: false,
                            data: {
                                SP_Pictureurl: result.value,
                                SP_ptype: ".jpg",
                                P_ReportNumber: P_ReportNumber11,
                                SP_Addr: 'preview' + a
                                //SP_Picturename: ns.innerText
                            },//所有上传文件统一为此对象。result.value 不再截取。type 为文件类型，带.
                            success: function (data) {
                                switch (data) {
                                    case -2: layer.msg('修改失败!', { icon: 2, time: 5000 }); break;
                                    case -1: layer.msg('上传图片失败!', { icon: 2, time: 5000 }); break;
                                    case 0: layer.msg('服务器连接失败!', { icon: 2, time: 5000 }); break;
                                    case 1: layer.msg('上传成功!', { icon: 1, time: 5000 }); break;
                                    case 2: layer.msg('修改成功!', { icon: 1, time: 5000 }); break;
                                }

                            },
                            error: function (XMLHttpRequest, textStatus, errorThrown) {
                                layer.msg('服务器连接失败!', { icon: 2, time: 5000 })
                            }
                        });
                        
                        // var ns = document.getElementById('preview' + a).nextElementSibling;   //获得s的下一个兄弟节点
                     
                    }
                    reader.readAsDataURL(file.files[0]);
               
                }

            }
            else {
                prevDiv.innerHTML = '<div class="img" style="filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod=scale,src=\'' + file.value + '\'"></div>';
            }
        }
        $(function () {
            //图片的回传显示



            $.ajax({
                type: "get",
                url: ApiUrl + "api/SitePicture/Picture",
                //async: false,
                data: {
                    P_ReportNumber: P_ReportNumber11
                },
                success: function (data, status) {
                    $(data).each(function (i, item) {
                        $("#" + item.SP_Addr + "").empty();
                        $("#" + item.SP_Addr + "").html('<img id="image"  src="' + ApiUrl + item.SP_Picturename + '" />');
                        //   document.getElementById(item.SP_Addr).innerHTML = '<img id="image"  src="' + item.SP_Picturename + '" />';
                    })
                },
                error: function (e) {
                    layer.msg('服务器链接超时!', { icon: 2, time: 5000 });
                },
                complete: function () {

                }
            })
        });
    </script>
    <style type="text/css">
        #preview, .img, img {
            width: 150px;
            height: 125px;
        }
    </style>

</body>
</html>
